import * as React from 'react';
import * as ReactDOM from 'react-dom';

import { Provider } from 'react-redux';
import createHistory from 'history/createBrowserHistory';
import { Route, Redirect, Switch } from 'react-router-dom';

import { ConnectedRouter, push } from 'react-router-redux';
import globalStore from './store/globalStore';
import { routes } from './routes';
import { Login, PrivateRoute } from './components/';

const store = globalStore();
const history = createHistory();
const loggedIn = localStorage.getItem('loggedIn');

ReactDOM.render(
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <div>
        <Switch>
          <Route path="/login" component={Login} />
          <Route
            exact={true}
            path="/"
            render={() => (
              loggedIn ? (
                <Redirect to="/home" />
              ) : <Redirect to="/login" />
            )}
          />
          {routes.map((route, i) => (
            console.log(route),
            <PrivateRoute key={i} {...route} />
          ))}
        </Switch>
      </div>
    </ConnectedRouter>
  </Provider>,
  document.getElementById('app')
)